<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>500 Writes</title>
    <script>
      window.process = { env: { NODE_ENV: 'development' } };
    </script>
  </head>

  <body>
    <div id="root"></div>
    <script type="module">
      import urqlClient from './urqlClient.js';
      import * as bench from '/bench.js';
      import { makeEntries } from './makeEntries.js';
      import {
        makeTodo,
        makeWriter,
        makeBook,
        makeStore,
        makeEmployee,
      } from './entities.js';
      import {
        getAllTodos,
        addTodos,
        addWriters,
        addBooks,
        addStores,
        addEmployees,
      } from './benchmarks.js';

      // create entities to be written
      const hundredTodos = makeEntries(100, makeTodo);
      const hundredWriters = makeEntries(100, makeWriter);
      const hundredBooks = makeEntries(100, makeBook);
      const hundredStores = makeEntries(100, makeStore);
      const hundredEmployees = makeEntries(100, makeEmployee);

      const benchmark = async () => {
        bench.start();
        await addTodos(hundredTodos);
        await addWriters(hundredWriters);
        await addBooks(hundredBooks);
        await addStores(hundredStores);
        await addEmployees(hundredEmployees);
        bench.stop();
      };

      benchmark();
    </script>
  </body>
</html>
